<template>
	<view>
		<u-navbar title-color="#fff" :is-back="true" 
		:is-fixed="true" :background="background":back-text-style="{color: '#fff'}" :title="nowUserClub.clubName">
		</u-navbar>
		<!-- 列表展示 -->
		<!-- 右边为操作，如果为2，则为超级管理员，只有注销操作，否则有退出操作 -->
		<index-tab-head :tabBars="tabBars" :tabIndex="tabIndex" @tabtap="tabtap"></index-tab-head>
		<swiper :style="{height:height+'px'}" :current="tabIndex" @change="tabChange">
			<!-- 用户管理 -->
			<swiper-item>
				<user-manage :nowUserClub="nowUserClub"></user-manage>
			</swiper-item>
			<!-- 活动管理 -->
			<swiper-item>
				<scroll-view scroll-y :style="{height:height+'px'}" >
					<activity-manage ref="activityManageRef" :nowUserClub="nowUserClub"></activity-manage>
				</scroll-view>
			</swiper-item>
			<!-- 基本信息 -->
			<swiper-item>
				<scroll-view scroll-y>
					<basic-manage :nowUserClub="nowUserClub"></basic-manage>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import indexTabHead from "../../../../components/index/index-tab-head.vue";
	import userManage from "./user-manage.vue";
	import activityManage from "./activity-manage.vue";
	import basicManage from "./basic-manage.vue";
	export default {
		computed: mapState(['isLogin', 'loginUserInfo']),
		components: {
			indexTabHead,userManage,activityManage,basicManage
		},
		data() {
			return {
				background: {
					'background': 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				},
				tabIndex: 0,
				height: this.swiperHeight - 40,
				tabBars: [{
						name: "会员管理",
						id: "0"
					},
					{
						name: "活动管理",
						id: "1"
					},
					{
						name: "基本信息",
						id: "2"
					}
				],
				nowUserClub:""
				
			}
		},
		onLoad(option) {
			this.nowUserClub = JSON.parse(decodeURIComponent(option.nowUserClub));
			console.log("当前社团",this.nowUserClub)
		},
		methods: {
			// 监听子组件的tab点击事件
			tabtap(index) {
				this.tabIndex = index;
				this.$refs.activityManageRef.updateOk();
			},
			// tab滑动事件
			tabChange(e) {
				this.tabIndex = e.detail.current
			},
		}
	}
</script>

<style>

</style>
